<template>
	<view class="content">
		<RobotData top="95" left="30"></RobotData>
		<view class="logo-area">
			<img src="../../static/logo.png"></img>
		</view>
		<view class="title-area">
			<img src="../../static/title.png"></img>
		</view>
		<view class="menu-box" v-if="userData.guestType">
			<view v-if="['Speaker','组委会','VIP','媒体','嘉宾','智享嘉宾'].includes(userData.guestType)">
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('qd')">
						签到 <img src="../../static/home/qd.png" class="menu-icon" style="margin-right: 12rpx;"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('yc',userData)">
						用餐 <img src="../../static/home/yc.png" class="menu-icon"></img>
					</view>
				</view>
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('zhyc')">
						主会议程 <img src="../../static/home/zhyc.png" class="menu-icon"
							style="margin-right: -12rpx;"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('gkk')">
						公开课 <img src="../../static/home/gkk.png" class="menu-icon"></img>
					</view>
				</view>
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('flt')">
						分论坛 <img src="../../static/home/flt.png" class="menu-icon"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('zq')" style="margin-bottom: 0;">
						展区 <img src="../../static/home/zq.png" class="menu-icon"></img>
					</view>
				</view>
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('chzn')">
						参会指南 <img src="../../static/home/chzn.png" class="menu-icon"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('hzhb')" style="margin-bottom: 0;">
						合作伙伴 <img src="../../static/home/hzhb.png" class="menu-icon"></img>
					</view>
				</view>
			</view>
			<view v-else>
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('zhyc')">
						主会议程 <img src="../../static/home/zhyc.png" class="menu-icon"
							style="margin-right: -12rpx;"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('gkk')">
						公开课 <img src="../../static/home/gkk.png" class="menu-icon"></img>
					</view>
				</view>
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('flt')">
						分论坛 <img src="../../static/home/flt.png" class="menu-icon"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('zq')" style="margin-bottom: 0;">
						展区 <img src="../../static/home/zq.png" class="menu-icon"></img>
					</view>
				</view>
				<view class="m-col">
					<view class="m-row menu-item" @tap="handlePage('chzn')">
						参会指南 <img src="../../static/home/chzn.png" class="menu-icon"></img>
					</view>
					<view class="m-row menu-item" @tap="handlePage('hzhb')" style="margin-bottom: 0;">
						合作伙伴 <img src="../../static/home/hzhb.png" class="menu-icon"></img>
					</view>
				</view>
			</view>
			<view class="bqxx">APPLICATIONS ARE HERE</view>
		</view>
	</view>
</template>

<script>
	import RobotData from '@/components/robot/robot.vue';
	export default {
		components: {
			RobotData
		},
		data() {
			return {
				userData: {}
			}
		},
		onLoad() {
			this.getInfo()
		},
		methods: {

			getInfo() {
				// 网络请求
				uni.showLoading({
					title: '请求中',
				});
				uni.request({
					url: 'https://baidu.btvs.cn/api/basic/guest/getInfo',
					method: 'GET',
					header: {
						Authorization: uni.getStorageSync('token')
					},
					dataType: 'json',
					success: (res) => {
						uni.hideLoading();
						if (res.data.code == 200) {
							this.userData = {
								...res.data.data
							}

						} else {
							uni.showToast({
								title: res.data.msg,
								icon: "error"
							})
							this.loginError = true
							if (res.data.code == 401) {
								uni.navigateTo({
									url: '/pages/index/index'
								})
							}

						}
					},
					fail: () => {
						uni.hideLoading();
						uni.showToast({
							title: '网络开小差了~',
							icon: "error"
						})
					},
				});
			},
			handlePage(path, data) {
				if (path == 'yc') {
					uni.navigateTo({
						url: `../${path}/${path}?type=` + data.guestType
					})
				} else {
					uni.navigateTo({
						url: `../${path}/${path}`
					})
				}

			}
		}
	}
</script>

<style lang="less">
	.content {
		height: 100vh;
		background: url('../../static/index_bg.jpg');
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;

		// .robot-area {
		// 	width: 120px;
		// 	position: absolute;
		// 	top: 40px;
		// 	left: 40px;
		// 	z-index: 9;

		// 	img {
		// 		// width: 100%;
		// 		height: 120rpx;
		// 		display: block;
		// 	}
		// }

		.logo-area {
			width: 120px;
			position: absolute;
			top: 40px;
			right: 40px;
			z-index: 9;

			img {
				width: 100%;
				display: block;
			}
		}

		.title-area {
			width: 100%;
			height: 100%;
			display: flex;
			justify-content: center;
			align-items: center;

			img {
				margin-top: -400rpx;
				width: 70%;
				display: block;
			}
		}

		.menu-box {
			width: 80%;
			margin: 0 auto;
			position: absolute;
			bottom: 60rpx;
			left: 10%;

			.m-col {
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 20rpx;

				.m-row {
					padding: 24rpx 34rpx;
					background-color: #fff;
					border-radius: 30rpx;
				}

				.menu-item {
					display: flex;
					justify-content: space-between;
					align-items: center;
					width: 48%;
					font-size: 32rpx;
					font-weight: 600;
					color: #230d61;

					.menu-icon {
						height: 66rpx;

					}
				}

				.d-col {
					display: flex;
					flex-direction: column;
					width: 48%;

					.m-row {
						padding: 24rpx 34rpx;
						background-color: #fff;
						border-radius: 30rpx;
						margin-bottom: 20rpx;
					}

					.menu-item {
						display: flex;
						justify-content: space-between;
						align-items: center;
						width: 100%;
						font-size: 32rpx;
						font-weight: 600;
						color: #230d61;

						.menu-icon {
							height: 66rpx;
						}
					}
				}

				.h-col {
					padding: 0;
					flex-direction: column;

					.menu-item {
						display: flex;
						justify-content: space-between;
						align-items: center;
						width: 100%;
						font-size: 32rpx;
						font-weight: 600;
						color: #230d61;

						.menu-icon {
							height: 66rpx;
						}

						&.img-right {
							// padding-top: 0;
							justify-content: flex-end;

							.menu-icon {
								height: 86rpx;
							}
						}
					}
				}
			}
		}

		.bqxx {
			margin-top: 30rpx;
			text-align: center;
			font-size: 26rpx;
			color: #fff;
		}
	}
</style>